<!-- 综合查询 -->
<template>
  <div id="comprehensiveInquiry">
    <van-search v-model="value" placeholder="请输入户主姓名" @search="serachData">
      <template #left>
        <div @click="show = true" style="margin-right: 5px;font-size: 14px;"><van-icon name="arrow-down" />{{
          areaValue }}</div>
      </template>
    </van-search>
    <div class="content">
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了">
        <van-cell v-for="(item, index) in contentData" @click="contentClick(item)" :key="index">
          <ul>
            <li>
              <p style="font-weight: bold; margin-bottom: 8px; height: 3vh">
                <span style>{{ item.XM }}</span>
              </p>
              <p style="font-size: 14px; color: #848484">
                当前进度：{{ item.NODE_NAME }}
              </p>
              <p style="font-size: 14px; color: #848484">
                申请时间：{{ item.CREATIONTIME }}
              </p>
              <p style="font-size: 14px; color: #848484">
                地址： {{ item.SQJFDZ || '暂无数据' }}
              </p>
            </li>
          </ul>
        </van-cell>
      </van-list>
    </div>
    <van-popup v-model="show" round position="bottom">
      <van-cascader v-model="cityCode" title="选择所属区域" :options="options" @change="onChange" @finish="onFinish"
        :closeable="false" style="position: relative;" />
      <span style="position: absolute; top: 0%; right: 10px;font-size: 16px;height: 48px;line-height: 48px;"
        @click="close">确定</span>
    </van-popup>
  </div>
</template>
<script>
import { QuerySignCallback, GetAdministrative, getDatalistForTree } from '@/utils/api'
import dd from 'gdt-jsapi'
export default {
  data() {
    return {
      show: false,
      loading: false,
      finished: false,
      contentData: [],
      options: [],
      areaValue: "所属区域",
      value: '',
      cityCode: '',
    }
  },
  mounted() {
    this.areaValue = window.localStorage.getItem('cityName') || '所属区域';
    dd.ready(function () {
      dd.setTitle({
        title: '综合查询',
      })
        .then((res) => { })
        .catch((err) => {
          console.error(err)
        })
    })
    this.getXianOpenDataView(window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : "441300000000")
    this.getcontentData()
  },
  methods: {
    serachData(val) {
      console.log(val, this.value)
      this.getcontentData()
    },
    getcontentData: async function () {
      this.contentData = []
      this.shenkaobeiData = []
      let arr = []
      if (this.value) {
        arr.push({ "table": "house_ApplyV2", "field": "XM", "type": "A", "operator": "like", "value": this.value, "link": "AND" })
      }
      let params1 = {
        accessCode: '688bd3883572440a859dfd8ba9194e7b',
        cityCode: "",
        params: {
          dataguid: '306064e1-6cb4-45e3-b27b-decc646fe62e',
          searchObject: [],
          token: window.localStorage.getItem('token'),
        },
      }
      if (!window.localStorage.getItem('citycode') || window.localStorage.getItem('citycode') == "330000000000") {
        params1.cityCode = "441300000000"
      } else {
        params1.cityCode = window.localStorage.getItem('citycode')
      }
      if (this.cityCode) {
        let cityCode = this.cityCode.toString()
        if (cityCode.substring(0, 12) === "330000000000") {
          params1.cityCode = "441300000000"
        } else if (cityCode.substring(4, 12) === "00000000") {
          params1.cityCode = cityCode.substring(0, 4) + "00000000"
        } else if (cityCode.substring(6, 12) === "000000") {
          if (cityCode.substring(0, 6) === "330112") {
            params1.cityCode = cityCode
          }
          arr.push({ "table": "house_ApplyV2", "field": "COUNTY", "type": "A", "operator": "in", "value": cityCode.substring(0, 6) + "000000", "link": "AND" })
        } else if (cityCode.substring(9, 12) === "000") {
          arr.push({ "table": "house_ApplyV2", "field": "TOWN", "type": "A", "operator": "in", "value": cityCode.substring(0, 9) + "000", "link": "AND" })
        } else {
          arr.push({ "table": "house_ApplyV2", "field": "VILLAGE", "type": "A", "operator": "in", "value": cityCode, "link": "AND" })
        }
      }
      params1.params.searchObject = JSON.stringify(arr)
      const res = await QuerySignCallback(params1)
      if (eval('(' + res.data.data + ')').Data) {
        this.contentData = eval('(' + res.data.data + ')').Data
        console.log(this.contentData, 'sdfbnuiebf')
        // this.shenkaobeiData = eval('(' + res.data.data + ')').Data
        // params.dataguid = '713761e1-74eb-4aec-8812-6b2e87fe3678'
        // const res1 = await QuerySignCallback(params1)
        // if (eval('(' + res1.data.data + ')').Data) {
        //   this.contentData.push(...eval('(' + res1.data.data + ')').Data)
        //   this.shenkaobeiData.push(...eval('(' + res1.data.data + ')').Data)
        // }
      }
      this.loading = true
      this.finished = true
    },
    onClickLeft() {
      this.$router.push({
        path: '/FeatureList',
      })
    },
    close() {
      this.show = false;
      this.getcontentData()
    },
    getXianOpenDataView: async function (data) {
      this.options = [{
        text: window.localStorage.getItem('cityName'),
        value: window.localStorage.getItem('citycode'),
        isHasChild: true
      }]
      const res = await getDatalistForTree(data)
      res.data.data.forEach((item) => {
        let obj = {
          text: item.cityname,
          value: item.citycode,
        }
        if (item.citycode.toString().substring(9, 12) !== "000") {

        } else {
          obj['children'] = []
        }
        this.options.push(obj)
      })
      // this.options = res.data.data
    },
    getXZQH: async function (value, selectedOptions, tabIndex) {
      var res = await GetAdministrative(value)
      selectedOptions[tabIndex].children = []
      if (res.data.data.length > 0) {
        res.data.data.forEach((element) => {
          let obj = {
            text: element.cityname,
            value: element.citycode
          }
          if (element.citycode.toString().substring(9, 12) !== "000") {

          } else {
            obj['children'] = []
          }
          selectedOptions[tabIndex].children.push(obj)
        })
      }
    },
    onChange({ value, selectedOptions, tabIndex }) {
      if (value.toString().substring(9, 12) !== "000" || selectedOptions[0].isHasChild) {

      } else {
        this.getXZQH(value, selectedOptions, tabIndex)
      }
      this.onFinish({ value, selectedOptions, tabIndex })
    },
    onFinish({ value, selectedOptions, tabIndex }) {
      this.areaValue = selectedOptions[selectedOptions.length - 1].text;
      this.cityCode = value
      // this.form.cityCode.length == 3 ? (this.IsShowAre = false) : ''
    },
    contentClick: async function (item) {
      this.$router.push({
        path: "/comprehensiveInquiryDetail",
        query: {
          data: JSON.stringify(item),
        },
      })
    },
  },
}
</script>
<style lang="scss" scoped>
#comprehensiveInquiry {
  height: 100vh;
  //   overflow: auto;
  background: #eee;
  font-size: 16px;
  overflow: hidden;

  .content {
    height: calc(100% - 60px);
    overflow: auto;

    ul li {
      background-color: white;
      // margin: 14px 10px;
      border-radius: 10px;
      padding: 10px;
      width: 100%;
      margin: 0 auto;
      margin-top: 6px;
      color: black;
      box-shadow: 0 0 12px #e3e3e3;
    }
  }
}
</style>

<style>
#comprehensiveInquiry .content .van-cell {
  background-color: #eee !important;
  padding: 4px 10px;
}
</style>
